<script type='text/template' id='variant_split_template'>
  <tr class='stock-item-split' data-variant-id='{{variant.id}}'>
    <td colspan='2'>
      <%= Spree.t("move_variant_to", default: "Move {{variant.name}} to") %>
    </td>
    <td colspan='2'>
    <select name="item_stock_location" id='item_stock_location' style='width:100%;'>
      <option></option>
      <optgroup label="<%=Spree.t('existing_shipments')%>">
        {{#each shipments}}
        <option data-shipment-number='{{this.number}}' value='{{this.stock_location_id}}'>{{this.stock_location.name}}({{this.number}})</option>
        {{/each}}
      </optgroup>
      <optgroup label="<%=Spree.t('new_shipment_at_location')%>">
        {{#each variant.stock_items}}
          <option data-new-shipment='true' value='{{this.stock_location_id}}'>{{this.stock_location_name}}&nbsp({{this.count_on_hand}} on hand)</option>
        {{/each}}
      </optgroup>
      </select>
    </td>
    <td>
      <input class="quantity form-control" id="item_quantity" type="number" min="1" value="1" max="{{max_quantity}}">
    </td>
    <td class='actions'>
      <a href='#' class='cancel-split with-tip btn btn-sm btn-default' title='Cancel'>
        <span class="icon icon-arrow-left"></span>
      </a>
      <a href='#' class='save-split with-tip btn btn-sm btn-success' title='Save'>
        <span class="icon icon-save"></span>
      </a>
    </td>
  </tr>
</script>
